<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品录入界面</title>

    <script src="js/jquery-2.1.1.min.js"></script>
</head>
<body>
<form method="post" action="/goods/save.action">
    商品标题:<input name="title"><br>
    商品价格:<input name="price"><br>
    商品图片:<input id="imgFile" type="file"><br>
    <input type ="hidden" name="img">
    <img id="defaaultImg" src="/static/img/right.png"><br>
    <input type="submit">
</form>
<script>
    $("#imgFile").change(function (event) {
       var reader = new FileReader();
       reader.readAsDataURL(event.target.files[0]);
       reader.onload=function (event) {
           $("#defaaultImg").attr("src",event.target.result);
           //把图片编码放到隐藏狱中
           $(":hidden[name=img]").val(event.target.result);
       }
    });
</script>

</body>
</html>